/**
 * Author: Lily Jiang
 * Create Time: 2019/12/24
 * Description:
 */

import React from "react";
import { connect } from "react-redux";
// import * as actions from "@/store/actions";
import './Index.scss'
import ArticleItem from '../components/articleItem/Index.js'
import AppHeader from '@/components/appHeader/Index.js'
import { ListView, PullToRefresh, Toast } from 'antd-mobile';
import PageHoc from '@/components/hoc/page.js'

class UserCollect extends React.Component {
    constructor(props) {
        super(props);

        this.state = {

        };
    }

    lv;

    componentDidMount () {

    }

    //  获取item进行展示
    renderRow = (item, i) => {
        return (
            <ArticleItem key={item.id.toString()}
                         showAuthor={false}
                         info={item}></ArticleItem>
        )
    }

    pageInit = () => {
        this.props.loadFirstPage()
    }

    apiFn = (pageNo) => {
        return React.$api.collectList({
            pageNo: pageNo,
            pageSize: this.props.pageSize
        })
    }

    getListViewHeight = () => {
        return this.mainRef.clientHeight
    }

    render() {
        return (
            <div className="app-container page_user-collect df-col">
                {<AppHeader title="收藏"></AppHeader>}
                <div className="main df1 of" ref={com => this.mainRef = com}>
                    {
                        this.props.list.length ?
                            <ListView
                                ref={el => this.lv = el}
                                dataSource={this.props.dataSource.cloneWithRows(this.props.list)}
                                renderFooter={() => (<div style={{ padding: 30, textAlign: 'center' }}>
                                    {this.props.upLoading ? '加载中' : '没有更多内容'}
                                </div>)}
                                renderRow={(rowData, id1, i) => this.renderRow(rowData, i)}
                                style={{
                                    height: this.props.height,
                                    overflow: 'auto'
                                }}
                                initialListSize={10}
                                pageSize={this.props.pageSize}
                                scrollRenderAheadDistance={500}
                                onEndReached={this.props.onEndReached}
                                onEndReachedThreshold={20}
                                pullToRefresh={<PullToRefresh refreshing={this.props.pullLoading}
                                                              onRefresh={this.props.onRefresh}/>}
                            /> : null
                    }
                </div>
            </div>
        );
    }
}

export default connect()(PageHoc()(UserCollect))